<template>
  <!-- 公司搜索页面 -->
  <view class="main">
    <view class="xian"></view>
    <view class="content">
      <view class="seach">
        <input
          type="text"
          value=""
          v-model="guanjian"
          @input="onInput"
          placeholder="如: 青岛一起来往"
        />
        <image
          src="../../imges/shan-chu.png"
          mode="aspectFill"
          @tap="clean"
        ></image>
      </view>
      <!-- 无关键词展示 -->
      <view class="wu_Huo" v-if="data.length == 0 && you">
        <image src="../../imges/kong_s.png" mode="aspectFill"></image>
        <text>暂无关键字命中</text>
      </view>
      <view class="seach1" v-for="item in data">
        <view @tap="go(item.orgName)" hover-class="none">
          <span>{{
            item.orgName.slice(
              0,
              item.orgName.toLowerCase().indexOf(guanjian.toLowerCase())
            )
          }}</span>
          <span style="color: #2a70fe">{{
            item.orgName.slice(
              item.orgName.toLowerCase().indexOf(guanjian.toLowerCase()),
              item.orgName.toLowerCase().indexOf(guanjian.toLowerCase()) +
                guanjian.length
            )
          }}</span>
          <span>{{
            item.orgName.substr(
              item.orgName.toLowerCase().indexOf(guanjian.toLowerCase()) +
                guanjian.length
            )
          }}</span>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import request from "../../utils/request.js";
export default {
  data() {
    return {
      data: [],
      guanjian: "",
      you: false,
    };
  },
  onLoad(option) {
    if (option.company) {
      this.guanjian = option.company;
      this.sousuo(option.company);
    }
  },
  methods: {
    clean() {
      this.guanjian = "";
      if (this.guanjian == "") {
        this.data = [];
      }
    },
    onInput(e) {
      console.log(e.detail, this.guanjian);
      if (this.guanjian == "") {
        this.data = [];
        this.you = false;
      } else {
        this.sousuo(e.detail.value);
      }
    },
    go(name) {
      uni.navigateBack({
        delta: 1,
      });
      uni.setStorage({
        key: "gsName",
        data: name,
        success: function () {
          console.log("success");
        },
      });
    },
    sousuo(value) {
      let token = uni.getStorageSync("token");
      const that = this;
      if (!token) {
        uni.showToast({
          title: "请授权登录再操作！",
          duration: 2000,
          icon: "none",
        });
        setTimeout(() => {
          uni.navigateTo({
            url: "/pages/index/index",
          });
        }, 2000);
      } else {
        request({
          url: "app/home/searchByType?uid=d44428b419f611e983f6fa163e4d6bc3",
          method: "POST",
          header: {
            "content-type": "application/json;charset=UTF-8",
            "api-client": "72e0fee8172411ea995200163e05ff66",
            "api-version": "1.3.3",
            "Source-Type": 7,
            token: token,
          },
          data: {
            keywords: value,
            type: 1,
            pageNumber: 1,
            pageSize: 100,
          },
        }).then((res) => {
          if (res.data.code == 200) {
            that.data = res.data.data.rows;
            that.you = true;
          } else if (res.data.code == 401) {
            uni.showToast({
              title: "登录失效，请重新授权登录！",
              duration: 2000,
              icon: "none",
            });
            setTimeout(() => {
              uni.navigateTo({
                url: "/pages/index/index",
              });
            }, 2000);
          } else {
            uni.showToast({
              title: res.data.msg,
              duration: 2000,
              icon: "none",
            });
          }
        });
      }
    },
  },
};
</script>

<style lang="less" scoped>
.xian {
  height: 2rpx;
  background-color: #dddddd;
}
.wu_Huo {
  margin-top: 200rpx;
  display: flex;
  flex-direction: column;
  align-items: center;

  image {
    width: 300rpx;
    height: 300rpx;
  }

  text {
    // display: inline-block;
    font-size: 28rpx;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: rgba(136, 136, 136, 1);
    line-height: 37px;
    // position: relative;
  }
}
.content {
  padding: 0 42rpx;
  box-sizing: border-box;
  .seach {
    padding: 37rpx 0;
    display: flex;
    justify-content: space-between;
    border-bottom: 2rpx solid #2168eb;
    input {
      width: 600rpx;
    }
    image {
      width: 29rpx;
      height: 29rpx;
    }
  }
  .seach1 {
    padding: 37rpx 0;
    border-bottom: 1rpx solid #eeeeee;
    font-size: 29rpx;
    font-weight: 400;
    color: #333333;
  }
}
// .bottom {
// 	width: 100%;
// 	height: 150rpx;
// 	background-color: #ffffff;
// 	display: flex;
// 	justify-content: center;
// 	align-items: center;
// 	position: fixed;
// 	bottom: 0;
// 	left: 0;
// 	.save {
// 		width: 686rpx;
// 		height: 80rpx;
// 		background-color: #2168EB;
// 		text-align: center;
// 		line-height: 80rpx;
// 		color: #ffffff;
// 		font-size: 32rpx;
// 		border-radius: 40rpx;
// 		margin: 0 auto;
// 		margin-top: 50rpx;
// 		position: fixed;
// 	}
// }
</style>
